import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
Vue.use(Vuex)
import createPersistedState from 'vuex-persistedstate'
export default new Vuex.Store({
  // 配置持久化插件:
  // - 只要数据存储到vuex中,就会自动将数据存储到本地存储
  // - 优先从本地存储获取数据到vuex中
  plugins:[createPersistedState()],
  // 唯一存储数据的地方
  state: {
    token: '',
    userInfo:{},
  },
  getters: {
  },
  // 唯一同步更新数据的地方
  mutations: {
    updateToken(state,token){
      state.token = token
    },
    // 4. 更新用户信息
    updateUserinfo(state,info){
      state.userInfo = info
    }
  },
  // 唯一异步获取数据,异步更新的地方
  actions: {
    // 2. 发送请求  获取用户信息, 存储到vuex中
   async initUserInfo(context){
     // context Store的实例对象 context.state.token
      // console.log(context);
      //2.1 发送请求   携带token数据
      const {data:res} = await axios.get('/my/userinfo')
      // res.data存储了用户信息的对象
      // console.log(res);

      // 3. 将获取到的数据存储到vuex中
      // context.commit('mutations中的函数',res.data)  数据抛过去
      context.commit('updateUserinfo',res.data)

    }
  },
  // 模块化
  modules: {
  }
})
